import React, { useState, useRef, useMemo,forwardRef } from 'react';
import {Form, Input, Modal } from 'antd';
import { message } from 'antd'
import UploadCom from './upload';
import store from '@/store';
type Iprops = {
  dialogData: Array<Object>
  pushMsg: (a: string, b: any) => void
  handleOk: (a: any, b: any) => void
  handleCancel: () => void
  setIsModalOpens: boolean
  titless: string | undefined
  backflow?: string
  // name: string
  [k: string]: any
  ModifyNameForm: any
  children?:React.ReactNode | React.ReactElement
}
const Dialog: React.FC<Iprops> = (props) => {
  // const [ModifyNameForm] = Form.useForm()
  let clearForm = useRef<any>()
  let { handleOk, handleCancel, setIsModalOpens, name, ModifyNameForm } = props
  let [imgUrl, setImgUrl] = useState<any>()
  let uploadRef = useRef<any>()
  // let [ccc,setccc] = useState<string>('')
  let aaaa = (rule: any, value: any) => {
    console.log(rule);
    
    if (!value) {
      return Promise.reject('请输入'+rule.field)
    } else {
      return Promise.resolve()
    }
  }
  const onFinish = (values: any) => {
    console.log('Success:', values);
  };
  const onFinishFailed = (errorInfo: any) => {
    message.error('没有正确的输入')
  };
  let uploadUrl = (c: any) => {
    setImgUrl(c)
  }
  let afterClose = ()=>{
    store.dispatch({type:'AFTER',payload:''})
    uploadRef.current.getFocus('')
    setImgUrl('')
    // if()
    // console.log(a);
    
  }
  // let handleChange = (a:any,e?:any)=>{
  //   // if()

  // }
  return (
    <>
      <Modal afterClose={afterClose} forceRender={true} destroyOnClose={false} title={props.titless} open={setIsModalOpens} onOk={() => { handleOk(clearForm, imgUrl) }} onCancel={() => { handleCancel() }} >
        <Form
          name="basic"
          labelCol={{ span: 4 }}
          wrapperCol={{ span: 16 }}
          ref={clearForm}
          form={ModifyNameForm}
          initialValues={{ remember: true }}
          onFinish={onFinish}
          onFinishFailed={onFinishFailed}
          autoComplete="off"
        >
          
          {
            props.children?props.children:<UploadCom uploadUrl={uploadUrl} ref={uploadRef}></UploadCom>
          }
          {
            props.dialogData.map((item: any) => {
              return (
                <Form.Item
                  key={item.title}
                  label={item.title + ':'}
                  name={item.name}
                  rules={[{ required: true, validator: aaaa }]}
                >
                  <Input />
                </Form.Item>
              )
            })
          }

        </Form>
      </Modal>
    </>
  );
};

export default Dialog;